let examination = [
    { Serial: '1', period: '2021年语文期中考试', name: '数学期中考试', time: '2021-05-20 14:00:00-2021-05-20 16:00:00', number: '100', operate: '考试监控详情' },
    { Serial: '2', period: '2021年语文期中考试', name: '语文期中考试', time: '2021-05-20 14:00:00-2021-05-20 16:00:00', number: '100', operate: '考试监控详情' },
    { Serial: '3', period: '2021年语文期中考试', name: '语文期中考试', time: '2021-05-20 14:00:00-2021-05-20 16:00:00', number: '100', operate: '考试监控详情' },
    { Serial: '4', period: '2021年语文期末考试', name: '数学期末考试', time: '2021-05-20 14:00:00-2021-05-20 16:00:00', number: '100', operate: '考试监控详情' },
];
let oTbody = document.querySelector('tbody');
let pages = document.querySelector('.pagination');
let selectA = document.querySelector('.select-page');
let inputA = document.querySelector('.lwy-page-info2');
let Butt = document.querySelector('.lwy-main-sect-button');
let Butt1 = document.querySelector('.lwy-main-sect-button1');
let input = document.querySelector('#exampleInputName2');
let input1 = document.querySelector('#exampleInputEmail2');
let iNow = 1;
let count = 3;
let count1 = 4;
let count2 = 2;
let show;
function render(iNow, num, arr) {
    if (show == count1) {
        num = show;
    } else if (show == count2) {
        num = show;
    } else if (show == count) {
        num = show;
    } else {
        num = count
    }
    let srt = '';
    let renderDate = arr.slice((iNow - 1) * num, iNow * num);
    for (let i = 0; i < renderDate.length; i++) {
        srt += ` 
    <tr>
    <td><input type="checkbox"></td>
    <td>${renderDate[i].Serial}</td>
    <td>${renderDate[i].period}</td>
    <td>${renderDate[i].name}</td>
    <td>${renderDate[i].time}</td>
    <td>${renderDate[i].number}</td>
    <td><button class="btn-success">进行中</button></td>
    <td><a href="../pages/lwy-monitoring-details.html"><span></span>${renderDate[i].operate}</a></td>
</tr>`
    }
    oTbody.innerHTML = srt
    // 创建分页
    let PagLeft = `<li>
<a class="left" href="#" aria-lable="Previous><span  class="left " aria-hidden="true"><span class="glyphicon glyphicon-menu-left  left"></span></span>
</a></li>`;
    let pagRight = `<li>
<a  class="right" href="#" aria-label="Next">
<span  class="right glyphicon glyphicon-menu-right" aria-hidden="true"></span>
</a>
</li>`;
    let pagStr = '';
    for (let i = 1; i <= Math.ceil(arr.length / num); i++) {
        if (iNow == i) {
            pagStr += `<li class="active"><a href="#">${i}</a></li>`;
        } else {
            pagStr += `<li><a href="#">${i}</a></li>`;
        };
        pages.innerHTML = PagLeft + pagStr + pagRight
    }
}
render(iNow, show, examination);
// 点击分页
function pan(e) {
    if (e.target.className.includes('left')) {
        if (iNow > 1) {
            iNow--;
        }
    } else if (e.target.className.includes('right')) {
        if (iNow < Math.ceil(examination.length / count)) {
            iNow++;
        }
    } else {
        iNow = e.target.innerText.trim();
    }
    render(iNow, show, examination)
};
pages.addEventListener('click', pan);
function sArr() {
    switch (selectA.value) {
        case '4条/页':
            show = count1;
            render(iNow, show, examination);
            break;
        case '3条/页':
            show = count;
            render(iNow, show, examination);
            break;
        case '2条/页':
            show = count2;
            render(iNow, show, examination);
            break;
    }
};
selectA.addEventListener('click', sArr);
inputA.addEventListener('blur', function () {
    if (inputA.value == '') {

    } else {
        iNow = inputA.value;
        render(iNow, show, examination);
    }
});
// 搜索
let inputArr;
Butt.addEventListener('click', function () {
    iNow=1;
    inputArr = [];
    let inputV = input.value;
    let inputV1 = input1.value;
    for (let i = 0; i < examination.length; i++) {
        if (examination[i].period.includes(inputV) && examination[i].name.includes(inputV1)) {
            inputArr.push(examination[i]);
        }
        render(iNow, show, inputArr);
    }
});
// 重置
Butt1.addEventListener('click', function () {
    input1.value = '';
    input.value = '';
    render(iNow, show, examination);
})
